

<!-- 我的地址 -->
<template>
	<view style="padding: 30upx;">
		
		<!-- 地址列表 -->
		<view class="row-between locationLi" v-for="(item, index) of addressList" :key="index" @click="checkAddress(index)">
			<view style="width: calc(100% - 124upx); border-right: 1upx solid #EEEEEE;padding: 0upx 24upx 0upx 36upx ;">
				<view class="consignee">
					<text>{{item.consignee}}</text>
					<text style="margin-left: 76upx;">{{item.telephone}}</text>
				</view>                        
				<view class="location-text">
					<text><text class="location-default-text" v-if="item.defaultFlag == '1'">默认</text>{{item.province}}{{item.city}}{{item.district}}{{item.address}}</text>
				</view>
			</view>
			<view class="redact-view">
				<image :src="icon.xiugai" @tap.stop="addAddress('change',item)"></image>
			</view>
		</view>
		
		
		<button class="add-btn" @click="addAddress('add',0)">+ 新建收货地址</button>
		
		<!-- <view @click="checkAddress(index)" class="list" v-for="(item, index) of addressList" :key="index">
			<view class="left">
				<view class="receive-person">
					姓名，手机号
					<view style="display: flex;width: 100%;font-weight: bold;">
						<view class="name">{{item.consignee}}</view>
						<view class="phone">{{item.telephone}}</view>
					</view>
					是否为默认
					<view class="address-msg ellipsis2">
						<view class="defaultFlag" v-if="item.defaultFlag == '1'">默认</view>
						{{item.province}}{{item.city}}{{item.district}}{{item.address}} </view>
				</view>
			</view>
			修改按钮
			<view class="right">
				<image :src="icon.xiugai" @tap.stop="addAddress('change',item)"></image>
			</view>
		</view> -->
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				icon:{
					xiugai:'/static/images/address/xiugai.png' 
				},
				
				select: -1,
				source: 0,
				addressList: []
			}
		},
		onLoad(option) {
			this.select = option.select;
		},
		onShow(){
			let that = this;
			this.$api.showLoading()
			that.$api.globalUtil.requestAjax({
				url: '/CustomerApi/findCustomerAddressByCustomerIdForApi',
				method: 'POST',
				success: function(res) {
					that.addressList = res.data.response;
				},
				complate: () => this.$api.hideLoading()
			});
		},
		methods: {
			//选择地址
			checkAddress(index) { 
				if(this.select == 1) {
					uni.setStorageSync('addressData', JSON.stringify(this.addressList[index]));
					uni.navigateBack({
					});
				}
			},
			// 跳转新增地址
			addAddress(type, item) {
				
				console.log(item);
				
				if(type == "add") {
					uni.navigateTo({
						url: "/pagesUser/address/addressManage?type="+type
					});
				}else {
					uni.navigateTo({
						url: "/pagesUser/address/addressManage?type="+type+"&data="+JSON.stringify(item)
					});
				}
			},
		}
	}
</script>

<style lang='scss'>
	
	.locationLi{
		background: #FFFFFF;
		border-radius: 10upx;
		padding: 35upx 0upx;
		color: #333333;
		font-family: PingFang SC;
		font-weight: 500;
		position: relative;
		margin-bottom: 20upx;
		.consignee{
			font-size: 26upx;
			font-weight: bold;
			margin-bottom: 29upx;
		}
		.location-text{
			font-size: 24upx;
			color: #666666;
		}
		.location-default-text{
			background: #FE5E49;
			border-radius: 3upx;
			font-size: 20upx;
			color: #FFFFFF;
			padding: 0upx 6upx;
			margin-right: 15upx;
		}
		.redact-view {
			width: 124rpx;
			height: 57rpx;
			color: #666666;
			font-size: 24rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			image{
					width: 30rpx;
					height: 30rpx;
			}
		}
		
	}
	
	page {
		padding-bottom: 120upx;
		background-color: #F5F5F5;
	}

	.content {
		position: relative;
	}

	.list {
		width: 690rpx;
		margin: 20rpx 0 0 30rpx;
		background-color: white;
		font-size: 26rpx;
		padding: 32rpx 0;
		border-radius: 10rpx;
		display: flex;
		align-items: center;
		.left {
			width: 565rpx;
			border-right: 1rpx solid #EEEEEE;
			padding: 0 24rpx 0 32rpx;
			.receive-person {
				color: #333333;
				
				.address-msg{
					color: #666;
					font-size: 24rpx;
					margin-top: 29rpx;
					
					.defaultFlag {
						width: 6upx;
						margin-right: 10upx;
						background: #FE5E49;
						border-radius:3upx;
						text-align: center;
						padding: 6upx;
						font-size:20upx;
						font-family: PingFang SC;
						font-weight:500;
						color: #FFFFFF;
					}
				}
				.name{
					width: 203rpx;
				}
			}
		}

		.right {
			width: 124rpx;
			height: 57rpx;
			color: #666666;
			font-size: 24rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			image{
					width: 30rpx;
					height: 30rpx;
			}
		}
	}

	.add-btn {
		z-index: 95;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 600rpx;
		height: 90rpx;
		font-size: 33rpx;
		color: #fff;
		margin: 0 auto;
		background: #FE5E49;
		border-radius: 45rpx;
		margin-top: 140rpx;
	}
</style>
